<!DOCTYPE html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>你的日记你做主</title>
	<link href="https://www.layuicdn.com/layui/css/layui.css" rel="stylesheet" />
</head>
<body>
<div style="width:35%;margin:20px auto;">
	<form class="layui-form" id="myform">
	  <div class="layui-form-item">
	    <label class="layui-form-label">日期</label>
	    <div class="layui-input-block">
	      <input type="text" name="date" id="date" required  lay-verify="required" placeholder="请输入日期" autocomplete="off" class="layui-input">
	    </div>
	  </div>
	  <div class="layui-form-item">
	    <label class="layui-form-label">天气</label>
	    <div class="layui-input-block">
	      <input type="text" name="weather"  required  lay-verify="required" placeholder="请输入天气" autocomplete="off" class="layui-input">
	    </div>
	  </div>
	  <div class="layui-form-item">
	    <label class="layui-form-label">日记类别</label>
	    <div class="layui-input-block">
	      <select name="cate" lay-verify="required">
	        <option value=""></option>
	        <option value="1">舔狗日记</option>
	        <option value="2">女神日记</option>
	        <option value="3">保安日记</option>
	        <option value="4">业主日记</option>
	      </select>
	    </div>
	  </div>
	  <div class="layui-form-item layui-form-text">
	    <label class="layui-form-label">日记内容</label>
	    <div class="layui-input-block">
	      <textarea name="content" placeholder="请输入内容 "  required lay-verify="required" class="layui-textarea"></textarea>
	    </div>
	  </div>
	   <div class="layui-form-item" >
	    <label class="layui-form-label">验证码</label>
	    <div class="layui-input-inline">
	      <input type="text" name="captcha" required lay-verify="required" placeholder="请输入验证码" autocomplete="off" class="layui-input">
	    </div>
	    <div class="layui-input-mid" style="line-height:38px;">
	    	<img src="/captcha/captchaImage?type=math" class="imgcode">
	    </div>
	  </div>
	  <div class="layui-form-item">
	    <div class="layui-input-block">
	      <button class="layui-btn" type="button" lay-submit lay-filter="myform">立即提交</button>
	      <button type="reset" class="layui-btn layui-btn-primary">重置</button>
	    </div>
	  </div>
	   <div class="layui-form-item layui-form-text">
	    <label class="layui-form-label">接口地址</label>
	    <div class="layui-form-mid layui-word-aux">http://api.diary.zmrit.com/random/{cate} cate支持1,2,3,4</div>
	  </div>
	</form>
</div>
<script type="text/javascript" src="https://www.layuicdn.com/layui/layui.js"></script>
<script>

layui.use(['form', 'laydate'], function(){
  var form = layui.form
  ,layer = layui.layer
  ,$=layui.jquery  
  ,laydate = layui.laydate;
  laydate.render({
    elem: '#date'
  });
function refreshCode(){
			var url ="/captcha/captchaImage?type=math&s=" + Math.random();
			$(".imgcode").attr("src", url);
		}  

  //监听提交  
  form.on('submit(myform)', function(data){
    $.ajax({
	      url:"/save",
	      type:"POST",
	      dataType: "json",
	      data:data.field,
	      success: function(res){
	      	if(res.code==0){
	      		layer.msg("提交成功,请等待审核");
	      		$("#myform")[0].reset();
	      	}else{
		      	layer.msg(res.msg);
	      	}
      		refreshCode();
	      }
	  })
    return false;
  });
  $(function() {
		$('.imgcode').click(function() {
			refreshCode();
		});
		
	});
	
   
  


});  
</script> 